<template>
  <div class="card mb2">
    <el-table :data="hisTaskList" style="width: 100%">
      <el-table-column type="expand">
        <template slot-scope="props">
          <el-form label-position="left" inline class="demo-table-expand">
            <el-form-item label="内容详情">
              <span>{{ props.row.flowFormList }}</span>
            </el-form-item>
          </el-form>
        </template>
      </el-table-column>
      <el-table-column label="任务 ID" prop="taskId"></el-table-column>
      <el-table-column label="任务名称" prop="taskName"></el-table-column>
      <el-table-column label="处理人" prop="taskOwner"></el-table-column>
      <el-table-column label="开始时间" prop="startTime"></el-table-column>
      <el-table-column label="结束时间" prop="endTime"></el-table-column>
    </el-table>

    <el-form ref="taskParam">
      <el-form-item
        v-for="(item) in taskFormList"
        :key="item.fieldName"
        :label="item.labelName"
        :value="item.fieldValue"
      >
        <template>
          <el-input v-model="taskForm[item.fieldName]" autocomplete="off" size="mini"></el-input>
        </template>
      </el-form-item>

      <el-form-item label="审核意见">
          <template>
             <el-input type="textarea" :rows="3" v-model="fixedForm.auditOption"></el-input>
          </template>
      </el-form-item>
      <el-form-item label="审核结果">
          <template>
            <el-radio v-model="fixedForm.auditResult"  label="1">通过</el-radio>
            <el-radio v-model="fixedForm.auditResult"  label="2">驳回</el-radio>
          </template>
      </el-form-item>

    </el-form>

    <div slot="footer">
       <el-button @click="saveTask();" type="primary">确定</el-button>
       <el-button @click="cancel();" type="primary">取消</el-button>
    </div>
  </div>
</template>
<script>
import { getTaskForm, getHisTask } from "./function";

export default {
  props: {
    taskId: null,
    instanceId: null
  },
  data() {
    return {
      formShow: false,
      taskForm: {},
      taskFormList: [],
      fixedForm: {
        auditOption: "",
        auditResult: "1"
      },
      hisTaskList: []
    };
  },
  watch: {
    taskId: {
      handler(v) {
        this.watchFdlIdHandle();
      },
      immediate: true
    }
  },
  mounted() {},
  methods: {
    initData() {
      let params = {
        taskId: this.taskId
      };
      this.taskForm = {};
      getTaskForm(params).then(res => {
        if (res.retHead.code == "0000000") {
          this.taskFormList = res.retBody;
        }
      });

      let hisParam = {
        instanceId: this.instanceId
      };
      getHisTask(hisParam).then(res => {
        if (res.retHead.code == "0000000") {
          console.log(res.retBody);
          this.hisTaskList = res.retBody;
        }
      });
    },
    watchFdlIdHandle() {
      this.initData();
    },
    /**
     * 提交
     */
    saveTask() {
      /**
      let parentObj = window.top.document;
      this.text = 'value:' + parentObj.documentElement.innerHTML; 
      window.parent.showMyModal();
      window.parent.printAcceptanceForm('{"business_id":"xxxx"}');
      */
      let param = {
        taskId: this.taskId,
        paramData: JSON.stringify(this.taskForm),
        auditOption: this.fixedForm.auditOption,
        auditResult: this.fixedForm.auditResult
      };
      console.log(param);
      this.$emit("dealTask", param);
    },
    cancel() {
      this.$emit("cancel");
    },
    deleteCancel() {},

    sizeChange(n) {
      this.pageSize = n;
      this.init();
    },
    currentChange(n) {
      this.currentPage = n;
      this.init();
    }
  }
};
</script>